<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>转运单创建</title>
    <link rel="stylesheet" href="http://static-online.zhaogangtest.com/publicresource/css/bootstrap-table.css">
    <link rel="stylesheet" href="../../../resources/public/css/table.css">
    <link rel="stylesheet" href="../../../resources/public/css/bootstrap-table-fixed-columns.css">
    <link rel="stylesheet" href="../../../resources/public/css/iconfont.min.css">
    <link rel="stylesheet" href="../../../resources/public/css/scmstrap.css">
</head>

<body>
    <div class="main">
        <!-- 条件区域 -->
        <div class="form-list">
            <div class="group">
                <label>
                    <b class="must">*</b>转运单号</label>
                <div class="scm-input-wrap">
                    <input type="text" class="scm-input scm-input-read" readonly value="系统自动生成">
                </div>
            </div>
            <div class="group">
                <label>
                    <b class="must">*</b>制单日期</label>
                <div class="scm-input-wrap">
                    <input type="text" class="scm-input scm-input-read" readonly value="2018-05-14 14:51:16">
                </div>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>发货仓库</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>收货仓库</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>发货方式</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>配货性质</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>业务机构</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>业务部门</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group">
                <label>
                    <b class="must">*</b>制单人</label>
                <div class="scm-input-wrap">
                    <input type="text" class="scm-input scm-input-read" readonly value="唐军">
                </div>
            </div>
            <div class="group">
                <label>
                    <b class="must">*</b>车船号</label>
                <div class="scm-input-wrap condition-msg-style">
                    <input type="text" class="scm-input" placeholder="">
                </div>
                <span class="condition-msg red">请用/隔开</span>
            </div>
            <div class="group group-select">
                <label>
                    <b class="must">*</b>提货方式</label>
                <div class="selectshow selectshowAction scm-input-wrap">
                    <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                </div>
                <ul class="select" style="display: none;">
                    <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                    <li>上海钢找塑料</li>
                    <li>上海找油网信息科技</li>
                </ul>
            </div>
            <div class="group">
                <label>备注</label>
                <div class="scm-input-wrap">
                    <input type="text" class="scm-input">
                </div>
            </div>
        </div>
        <!-- 按钮 -->
        <div class="operation">
            <!-- <div class="conditionbtn">
                <button class="scm-btn blue">
                    <i class="anticon icon-search1"></i>查询</button>
                <button class="scm-btn">
                    <i class="anticon icon-delete"></i>重置</button>
            </div> -->
            <div class="scm-btn-group fr">
                <button class="scm-btn btn-goods">
                    <i class="anticon icon-isv"></i>现货物资
                </button>
                <button class="scm-btn btn-disable-style">
                    <i class="anticon icon-isv"></i>计划物资
                </button>
                <button class="scm-btn">
                    <i class="anticon icon-delete"></i>删除
                </button>
            </div>
        </div>
        <div class="box-table">
            <table class="table table-condensed" id="table-parent"></table>
        </div>
    </div>
    <!--start--现货物资-->
    <div class="layer-goods" style="display: none;">
        <div class="main">
            <!-- 条件区域 -->
            <div class="form-list">
                <div class="group group-select">
                    <label>
                        品类</label>
                    <div class="selectshow selectshowAction scm-input-wrap">
                        <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                    </div>
                    <ul class="select" style="display: none;">
                        <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                        <li>上海钢找塑料</li>
                        <li>上海找油网信息科技</li>
                    </ul>
                </div>
                <div class="group group-select  group-selectSearch">
                    <label><b class="must">*</b>品名</label>
                    <div class="selectshowAction scm-input-wrap  selectshow" id="company">
                        <input type="text" class="scm-input" placeholder="">
                    </div>
                    <div class="select-search select" style="display: none;">
                        <div class="select-search-container" id="companywrap">
                        </div>
                    </div>
                </div>
                <div class="group group-select  group-selectSearch">
                    <label><b class="must">*</b>材质</label>
                    <div class="selectshowAction scm-input-wrap  selectshow" id="company1">
                        <input type="text" class="scm-input" placeholder="">
                    </div>
                    <div class="select-search select" style="display: none;">
                        <div class="select-search-container" id="companywrap1">
                        </div>
                    </div>
                </div>
                <div class="group">
                    <label>
                        <b class="must">*</b>规格</label>
                    <div class="scm-input-wrap">
                        <input type="text" class="scm-input">
                    </div>
                </div>
                <div class="group group-select  group-selectSearch">
                    <label><b class="must">*</b>品质</label>
                    <div class="selectshowAction scm-input-wrap  selectshow" id="company2">
                        <input type="text" class="scm-input" placeholder="">
                    </div>
                    <div class="select-search select" style="display: none;">
                        <div class="select-search-container" id="companywrap2">
                        </div>
                    </div>
                </div>
                <div class="group group-select">
                    <label>
                        计量方式</label>
                    <div class="selectshow selectshowAction scm-input-wrap">
                        <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                    </div>
                    <ul class="select" style="display: none;">
                        <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                        <li>上海钢找塑料</li>
                        <li>上海找油网信息科技</li>
                    </ul>
                </div>
                <div class="group group-select">
                    <label>
                        交货状态</label>
                    <div class="selectshow selectshowAction scm-input-wrap">
                        <input type="text" class="scm-input hand" readonly="" placeholder="全部">
                    </div>
                    <ul class="select" style="display: none;">
                        <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                        <li>上海钢找塑料</li>
                        <li>上海找油网信息科技</li>
                    </ul>
                </div>
                <div class="group group-select">
                    <label>
                        <b class="must">*</b>提货仓库</label>
                    <div class="selectshow selectshowAction scm-input-wrap disabled">
                        <input type="text" class="scm-input hand  scm-input-read" readonly="" placeholder="全部">
                    </div>
                    <ul class="select" style="display: none;">
                        <li>上海钢富信息科技有限公司上海钢富信息科技有限公司</li>
                        <li>上海钢找塑料</li>
                        <li>上海找油网信息科技</li>
                    </ul>
                </div>
                <div class="group group-select  group-selectSearch">
                    <label><b class="must">*</b>提货库房</label>
                    <div class="selectshowAction scm-input-wrap  selectshow" id="company3">
                        <input type="text" class="scm-input" placeholder="">
                    </div>
                    <div class="select-search select" style="display: none;">
                        <div class="select-search-container" id="companywrap3">
                        </div>
                    </div>
                </div>
            </div>
            <!-- 按钮 -->
            <div class="operation">
                <div class="conditionbtn">
                    <button class="scm-btn blue">
                        <i class="anticon icon-search1"></i>查询</button>
                    <button class="scm-btn">
                        <i class="anticon icon-delete"></i>重置</button>
                </div>
            </div>
            <div class="box-table">
                <table class="table table-condensed" id="layer-table-goods"></table>
            </div>
        </div>
    </div>
    <!-- end -->
    <script src="http://static-online.zhaogangtest.com/publicresource/js/require.js"></script>
    <script>
    var page;

    require.config({
        paths: {
            "jquery": "../../../resources/public/js/jquery.min",
            "bootstrap": 'http://static-online.zhaogangtest.com/publicresource/js/bootstrap.min',
            // "bootstrap-table": "http://static-online.zhaogangtest.com/publicresource/js/bootstrap-table",
            "bootstrap-table": "../../../resources/public/js/bootstrap-table",

            "layer": 'http://static-online.zhaogangtest.com/publicresource/control/layer/layer.min',
            "public": "../../../resources/public/js/public",
            "chinese": "../../../resources/public/js/chinese",
            "bootstrap-table-fixed": "../../../resources/public/js/bootstrap-table-fixed-columns",
            "autocomplete": "../../../resources/public/js/jquery.autocomplete",
        },
        shim: {
            "jquery": {
                exports: ['jQuery', '$']
            },
            "bootstrap": {
                deps: ["jquery"]
            },
            "bootstrap-table": {
                deps: ["jquery", "bootstrap"]
            },
            "bootstrap-table-fixed": {
                deps: ["bootstrap-table"]
            },
            "layer": {
                deps: ["jquery"],
                exports: "layer"
            },
            "autocomplete": {
                deps: ['jquery']
            },
            "chinese": {
                deps: ["jquery", "bootstrap-table"],
            },

            "public": {
                deps: ["jquery", "bootstrap-table"]
            }
        }
    });
    require(["autocomplete", "public", "layer", "chinese", "bootstrap-table-fixed"], function() {
        layer.config({
            path: 'http://static-online.zhaogangtest.com/publicresource/control/layer/'
        });
        $(function() {
            page = {
                init: function() {
                    this.bootstrapTable();
                    this.fn_layer();
                    this.autocomplete();
                    var that = this;
                    $(window).resize(function() {
                        $('#table-parent').bootstrapTable('resetView', {
                            height: that.getHeight()
                        });
                    });
                },
                bootstrapTable: function() {
                    $('#table-parent').bootstrapTable({
                        uniqueId: "id",
                        pagination: true, //在表格底部显示分页工具栏
                        pageSize: 50,
                        pageNumber: 1,
                        pageList: [10, 25, 50, 100],
                        height: page.getHeight(),
                        showFooter: true,
                        showColumns: false,
                        showRefresh: false,
                        //                    showToggle:true,
                        search: false,
                        //                    showPaginationSwitch:true,
                        detailView: true,
                        detailFormatter: page.showdetail,
                        // detailFormatter: this.showChild,
                        // onExpandRow: this.expandRow,
                        // onCollapseRow: this.collapseRow,
                        locales: 'zh-CN',
                        fixedColumns: false,
                        fixedNumber: 1,
                        url: '../data/erp/tablelist-inventory-share.json',
                        sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）

                        columns: [{
                            "field": "n0",
                            "title": "序号",
                            formatter: function(value, row, index) {
                                return index + 1
                            },
                            footerFormatter: "合计"
                        }, {
                            "field": "n1",
                            "title": "<b class='must'>*</b>&nbsp;库房",
                        }, {
                            "field": "n2",
                            "title": "品名",
                        }, {
                            "field": "n3",
                            "title": "材质",
                        }, {
                            "field": "n4",
                            "title": "标准",
                        }, {
                            "field": "n5",
                            "title": "规格",
                        }, {
                            "field": "n6",
                            "title": "指定长度",
                        }, {
                            "field": "n7",
                            "title": "品质",
                        }, {
                            "field": "n8",
                            "title": "计量方式",
                        }, {
                            "field": "n9",
                            "title": "交货状态",
                        }, {
                            "field": "n10",
                            "title": "件支数",
                        }, {
                            "field": "n11",
                            "title": "产品类型",

                        }, {
                            "field": "n12",
                            "title": "<b class='must'>*</b>&nbsp;应提数量",
                            footerFormatter: public.fn_sumformatter,

                        }, {
                            "field": "n13",
                            "title": "<b class='must'>*</b>&nbsp;应提重量",
                            footerFormatter: public.fn_sumformatter,

                        }, {
                            "field": "n14",
                            "title": "备注",

                        }]
                    });
                },
                showdetail: function(a, b, c) {
                    $(c).append(
                        '<div class="box-body"><table class="table table-condensed innerTable" id="tabledetail' +
                        a + '"></table></div>');
                    $('#tabledetail' + a).bootstrapTable({
                        pagination: false, //在表格底部显示分页工具栏
                        showFooter: true,
                        locales: 'zh-CN',
                        url: '../data/erp/tablelist-inventory-warehouse-child.json',
                        sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
                        columns: [{
                                "field": "n1",
                                "title": "品名"
                            },
                            {
                                "field": "n2",
                                "title": "计量方式"
                            },
                            {
                                "field": "n3",
                                "title": "标准",
                            },
                            {
                                "field": "n4",
                                "title": "材质"
                            },
                            {
                                "field": "n5",
                                "title": "规格"
                            }, {
                                "field": "n6",
                                "title": "品质",
                            }, {
                                "field": "n7",
                                "title": "厚度",
                            }, {
                                "field": "n8",
                                "title": "宽度",
                            }, {
                                "field": "n9",
                                "title": "长度",
                            }, {
                                "field": "n10",
                                "title": "直径",
                            }, {
                                "field": "n11",
                                "title": "重量",
                            }, {
                                "field": "n12",
                                "title": "轧制批号",
                            }, {
                                "field": "n13",
                                "title": "版号",
                            }, {
                                "field": "n14",
                                "title": "条形码",
                            }, {
                                "field": "n15",
                                "title": "库区",
                            }
                        ],

                    });
                },
                showdetailLayer: function(a, b, c) {
                    $(c).append(
                        '<div class="box-body"><table class="table table-condensed innerTable" id="layer-tabledetail' +
                        a + '"></table></div>');
                    $('#layer-tabledetail' + a).bootstrapTable({
                        pagination: false, //在表格底部显示分页工具栏
                        showFooter: false,
                        locales: 'zh-CN',
                        url: '../data/erp/tablelist-inventory-warehouse-child.json',
                        sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
                        columns: [{
                                "field": "n1",
                                "title": "品名"
                            },
                            {
                                "field": "n2",
                                "title": "材质"
                            },
                            {
                                "field": "n3",
                                "title": "规格",
                            },
                            {
                                "field": "n4",
                                "title": "品质"
                            },
                            {
                                "field": "n5",
                                "title": "计量方式"
                            }, {
                                "field": "n6",
                                "title": "交货状态",
                            }, {
                                "field": "n7",
                                "title": "条形码",
                            }, {
                                "field": "n8",
                                "title": "库区",
                            }, {
                                "field": "n9",
                                "title": "厚度",
                            }, {
                                "field": "n10",
                                "title": "宽度",
                            }, {
                                "field": "n11",
                                "title": "长度",
                            }, {
                                "field": "n12",
                                "title": "直径",
                            }, {
                                "field": "n13",
                                "title": "重量",
                            }, {
                                "field": "n14",
                                "title": "炉批号",
                            }, {
                                "field": "n15",
                                "title": "件支数",
                            }, {
                                "field": "n15",
                                "title": "捆包号",
                            }, {
                                "field": "n15",
                                "title": "轧制批号",
                            }
                        ],

                    });
                },
                autocomplete: function() {
                    var data = ['上海钢找塑料', '上海钢富信息科技有限技有限公司', '上海找油网信息科技', '上海长城实业有限公司',
                        '上海找油网信息科技', '上海长城实业有限公司'
                    ]
                    $("#company input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company1 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap1',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company2 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap2',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company3 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap3',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company4 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap4',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                },
                // 表格高度
                getHeight: function() {
                    var _height = $('.form-list').outerHeight(
                        true) + $('.operation').outerHeight(true)
                    return $(window).height() - _height - 20;
                },
                fn_layer: function() {
                    $(document).on('click', '.btn-goods', function() {
                        layer.open({
                            type: 1, //page层
                            area: ['1100px', '580px'],
                            title: '现货物资',
                            shadeClose: false,
                            btn: ['保存', '取消'],
                            shade: 0.01, //遮罩透明度
                            moveType: 1, //拖拽风格，0是默认，1是传统拖动
                            shift: -1, //0-6的动画形式，-1不开启
                            content: $('.layer-goods'),
                            skin: "skin-searchMore skin-overflow",
                            yes: function() {}
                        })
                        $('#layer-table-goods').bootstrapTable({
                            uniqueId: "id",
                            pagination: true, //在表格底部显示分页工具栏
                            pageSize: 50,
                            pageNumber: 1,
                            pageList: [10, 25, 50, 100],
                            height: 320,
                            showFooter: true,
                            showColumns: false,
                            showRefresh: false,
                            //                    showToggle:true,
                            search: false,
                            //                    showPaginationSwitch:true,
                            // detailView: true,
                            // detailFormatter: page.showdetail,
                            // detailFormatter: this.showChild,
                            // onExpandRow: this.expandRow,
                            // onCollapseRow: this.collapseRow,
                            locales: 'zh-CN',
                            fixedColumns: false,
                            fixedNumber: 1,
                            url: '../data/erp/tablelist-inventory-share.json',
                            sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）

                            columns: [{
                                checkbox: true,
                            }, {
                                "field": "n0",
                                "title": "序号",
                                formatter: function(value, row, index) {
                                    return index + 1
                                },
                                footerFormatter: "合计"
                            }, {
                                "field": "n1",
                                "title": "品名",
                            }, {
                                "field": "n2",
                                "title": "材质",
                            }, {
                                "field": "n3",
                                "title": "规格",
                            }, {
                                "field": "n4",
                                "title": "品质",
                            }, {
                                "field": "n5",
                                "title": "计量方式",
                            }, {
                                "field": "n6",
                                "title": "交货状态",
                            }, {
                                "field": "n7",
                                "title": "仓库",
                            }, {
                                "field": "n8",
                                "title": "件支数",
                            }, {
                                "field": "n9",
                                "title": "库房",
                            }, {
                                "field": "n10",
                                "title": "产品类型",
                            }, {
                                "field": "n11",
                                "title": "库存数量",
                                footerFormatter: public.fn_sumformatter,
                            }, {
                                "field": "n12",
                                "title": "库存重量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n13",
                                "title": "可售数量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n14",
                                "title": "可售重量",
                                footerFormatter: public.fn_sumformatter,
                            }, {
                                "field": "n15",
                                "title": "总锁定数量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n16",
                                "title": "总锁定重量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n17",
                                "title": "订单锁货数量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n18",
                                "title": "订单锁货重量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n19",
                                "title": "提单锁货数量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n20",
                                "title": "提单锁货重量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n21",
                                "title": "转运锁货数量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n22",
                                "title": "转运锁货重量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n23",
                                "title": "在途数量",
                                footerFormatter: public.fn_sumformatter,

                            }, {
                                "field": "n24",
                                "title": "在途重量",
                                footerFormatter: public.fn_sumformatter,

                            }]
                        });

                    })
                }
            }
            page.init();
        })
    })
    </script>
</body>

</html>